<template>
  <view >
    <view class="counselor">
        <view class="mod">
            <view class="hd">
                <h2>什么是房象咨询师？</h2>
            </view>
            <view class="bd">
                <ul class="container-intr-v3">
                    <li>
                        <view class="pic">
                            <img src="../../../static/img00/dow1.png" alt="高素质" />
                        </view>
                        <view class="con">
                            <view class="tit">高素质</view>
                            <view class="txt">
                                <p>42%211、985毕业</p>
                                <p>100%本科毕业</p>
                            </view>
                        </view>
                    </li>

                    <li>
                        <view class="pic">
                            <img src="../../../static/img00/dow1.png" alt="严要求" />
                        </view>
                        <view class="con">
                            <view class="tit">严要求</view>
                            <view class="txt">
                                <p>30天岗前培训</p>
                                <p>严格服务考核</p>
                            </view>
                        </view>
                    </li>

                    <li>
                        <view class="pic">
                            <img src="../../../static/img00/dow1.png" alt="更专业" />
                        </view>
                        <view class="con">
                            <view class="tit">更专业</view>
                            <view class="txt">
                                <p>实地勘察百个楼盘</p>
                                <p>提供全城楼盘咨询</p>
                            </view>
                        </view>
                    </li>
                </ul>
            </view>
        </view>
    </view>

    <view class="container">
        <Geren :jdata="lists"></Geren>
    </view>
	<view class="bottom"></view>
	<tabBar></tabBar>
  </view>
</template>

<script>
// 引入咨询师组件
import Geren from "./Geren";
import tabBar from '@/components/tabBar/tabBar.vue'

export default {
  components: {
    Geren,
	tabBar
  },
	onLoad(e) {
		this.initData();
	},
  data() {
    return {
		lists:{}
	};
  },
  methods: {
	  initData() {
	  	
	  	//获取首页配置
	  	this.$api.getPageCounselor({
	  			// code: this.pageCode
	  		},
	  		res => {
	  			
	  			// this.loupanList = res.data.loupanList;
	  			// this.counselor = res.data.counselor;
	  			// this.news_res = res.data.news_res;
	  			// this.tui_res = res.data.tui_res;
	  			this.lists = res.data.lists.data;
	  			console.log(this.lists);
	  		}
	  	);
	  },
  },
};
</script>

<style scoped>
* {
  margin: 0;
  padding: 0;
  list-style: none;
}

.counselor {
  height: 440upx;
  width: 750upx;
  background: #fff;
}
.mod {
  height: 352upx;
  width: 670upx;
  margin: 0 auto;
  position: relative;
  top: 50%; /*偏移*/
  transform: translateY(-50%);
}
.hd {
  /* margin: 2.8rem 0 32upx 0; */
}
.container-intr-v3 {
  height: 300upx;
  /* margin-left: 20upx; */
}
.container-intr-v3 > li {
  height: 272upx;
  width: 220upx;
  margin-top: 20upx;
  float: left;
}

.pic {
  height: 132upx;
  text-align: center;
}
.pic > img {
  height: 132upx;
  width: 132upx;
}

.con {
  height: 148upx;
  width: 11.20upx;
}
.tit {
  height: 72upx;
  width: 234upx;
  font-size: 32upx;
  color: #3e4a59;
  font-weight: 700;
  text-align: center;
  margin-top: 10upx;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.txt {
  /* width: 234upx; */
  height: 72upx;
  color: #a8adb4;
  font-size: 24upx;
  line-height: 36upx;
  /* margin-top: 10upx; */
  margin-left: 50upx;
  text-align: center;
}
.txt > p {
  width: 180upx;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bottom{
		height: 120rpx;
	}

</style>
